import Vue from 'vue'
import Router from 'vue-router'
import Index from '@/pages/index/index'
import Family from '@/pages/family/index'
import Shop from '@/pages/shop/index'
import DemoIndex from '@/pages/demo/index'
import DemoResult from '@/pages/demo/result'
import DemoSwiper from '@/pages/demo/swiper'
import DemoDraw from '@/pages/demo/draw'
import DemoActivity from '@/pages/demo/activity'
import DemoFamily from '@/pages/demo/family'
import DemoTest from '@/pages/demo/test'
import DemoLodash from '@/pages/demo/lodash'

// Test
import Test from '@/pages/test'
import TestTmpl from '@/pages/test/tmpl'
import TestToNum from '@/pages/test/toNum'
import TestPromise from '@/pages/test/promise'
import TestMoney from '@/pages/test/money'
import TestSpeak from '@/pages/test/speak'
import TestNext from '@/pages/test/next'
import TestInput from '@/pages/test/input'
import TestInput2 from '@/pages/test/input2'
import TestElement from '@/pages/test/element'
import TestObserver from '@/pages/test/observer'
import TestApply from '@/pages/test/apply'
import TestEchart from '@/pages/test/echart'
// 同步加载模块
// import TestDefineProperty from '@/pages/test/defineProperty'
// 异步加载模块
const TestDefineProperty = (resolve) => {
  import('@/pages/test/defineProperty').then((module) => {
    resolve(module)
  })
}
import TestExam from '@/pages/test/exam'
import TestClock from '@/pages/test/clock'

// Canvas
import Canvas from '@/pages/canvas'
import CanvasRate from '@/pages/canvas/rate'
import CanvasBall from '@/pages/canvas/ball'
import CanvasD3 from '@/pages/canvas/d3'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Index',
      component: Index
    },
    {
      path: '/family',
      name: 'Family',
      component: Family
    }, {
      path: '/shop',
      name: 'Shop',
      component: Shop
    },
    {
      path: '/demo/index',
      name: 'DemoIndex',
      component: DemoIndex
    },
    {
      path: '/demo/result',
      name: 'DemoResult',
      component: DemoResult
    },
    {
      path: '/demo/swiper',
      name: 'DemoSwiper',
      component: DemoSwiper
    },
    {
      path: '/demo/draw',
      name: 'DemoDraw',
      component: DemoDraw
    },
    {
      path: '/demo/activity',
      name: 'DemoActivity',
      component: DemoActivity
    },
    {
      path: '/demo/family',
      name: 'DemoFamily',
      component: DemoFamily
    },
    {
      path: '/demo/test',
      name: 'DemoTest',
      component: DemoTest
    },
    {
      path: '/demo/lodash',
      name: 'DemoLodash',
      component: DemoLodash
    },
    {
      // test
      path: '/test',
      name: 'Test',
      component: Test,
      children: [
        {
          path: 'tmpl',
          component: TestTmpl
        },
        {
          path: 'toNum',
          component: TestToNum
        },
        {
          path: 'promise',
          component: TestPromise
        },
        {
          path: 'money',
          component: TestMoney
        },
        {
          path: 'speak',
          component: TestSpeak
        },
        {
          path: 'next',
          component: TestNext
        },
        {
          path: 'input',
          component: TestInput
        },
        {
          path: 'input2',
          component: TestInput2
        },
        {
          path: 'element',
          component: TestElement
        },
        {
          path: 'observer',
          component: TestObserver
        },
        {
          path: 'apply',
          component: TestApply
        },
        {
          path: 'define', // 慎用关键字做路由名，比如: defineProterty
          component: TestDefineProperty
        },
        {
          path: 'exam',
          component: TestExam
        },
        {
          path: 'clock',
          component: TestClock
        },
        {
          path: 'echart',
          component: TestEchart
        }
      ]
    },
    {
      // canvas
      path: '/canvas',
      name: 'Canvas',
      component: Canvas,
      children: [
        {
          path: 'rate',
          component: CanvasRate
        },
        {
          path: 'ball',
          component: CanvasBall
        },
        {
          path: 'd3',
          component: CanvasD3
        },
      ]
    },
  ]
})
